<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>

    <div id="div"></div>

    <script>

        // 工厂模式
        // function createPerson(name, age, job) {
        //     var o = new Object();
        //     o.name = name;
        //     o.age = age;
        //     o.job = job;
        //     o.sayName = function(){
        //         console.log(this.name);
        //     };
        //     return o;
        // };
        // var person = createPerson('哈喽', 19, '搬砖');
        // var person2 = createPerson('小乔', 34, '装修');
        // 解决了创建多个相似对象的问题，但缺点是无法识别对象类型；

        // 构造函数模式
        // function Person(name, age, job) {
        //     this.name = name;
        //     this.age = age;
        //     this.job = job;
        //     this.sayName = function(){
        //         console.log(this.name);
        //     };
        // };
        // var person = new Person('哈喽', 19, '搬砖');
        // var person2 = new Person('小乔', 34, '装修');
        /*
            优点：
                没有显式地创建对象
                直接将属性和方法赋给了this对象
                没有return 语句
        */

        // 原型模式
        // function Person(){};
        // Person.prototype.name = '韩信';
        // Person.prototype.age = 18;
        // Person.prototype.sayName = function(){
        //     console.log(this);
        //     console.log(this.name);
        // }
        // var person = new Person();
        // person.sayName();  // '韩信'
        // var person2 = new Person();
        // person2.sayName();  // '韩信'


          function SuperType(name) {
              this.name = name;
              this.colors = ['red', 'blue', 'green'];
          };
          SuperType.prototype.sayName = function(){
              console.log(this.name);
          }

          function SubType(name, age) {
              // 继承属性
              SuperType.call(this, name);
              // 实例方法
              this.age = age
          };
        //   SubType.prototype = new SuperType();
        //   SubType.prototype.constrouctor = SubType;
            inheritPrototype(SubType, SuperType);
          SubType.prototype.sayAge = function(){
              console.log(this.age);
          };


          var instance1 = new SubType('小乔', 29), instance2 = new SubType('韩信', 34);
          instance1.colors.push('yellow');


      console.log(instance1.colors);  //["red", "blue", "green", "yellow"]
      console.log(instance2.colors);  //["red", "blue", "green"]

      console.log(instance1, instance2);

      function inheritPrototype(subType, superType) {
          var prototype = object(superType.prototype);
          prototype.constrouctor = subType;
          subType.prototype = prototype;
      };



    //   instance1.sayAge();   // 29
    //   instance1.sayName();  // 小乔

    //   instance2.sayAge();   // 34   
    //   instance2.sayName();  //  韩信

    function object(o) {
        function F(){};
        F.prototype = o;
        return new F();  // 这个新对象将person作为原型，让实例共享
    }

    // var person = {
    //     name:'叶问',
    //     firends:['霸王龙', '泰森']
    // };

    // var anotherPerson = object(person);
    // anotherPerson.firends.push('洪师傅');

    // var yetAnotherPerson = object(person);
    // console.log(yetAnotherPerson.firends);  // ["霸王龙", "泰森", "洪师傅"]

    // console.log(anotherPerson, yetAnotherPerson)

    // console.log(anotherPerson.__proto__ === yetAnotherPerson.__proto__)

    // function createAnother(original) {
    //     var clone = Object(original);
    //     clone.sayHi = function(){
    //         console.log(this);
    //     }
    //     return clone;
    // }

    // var anotherPerson = createAnother(person);
    // anotherPerson.firends.push('洪师傅');




    // console.log(anotherPerson, person)













        
    </script>
    
</body>
</html>